<template>
  <view class="MyMessage">
    <van-tabs
      :active="0"
      @change="changeMessageTab"
      animated
      swipeable
      color="#05A47D"
    >
      <van-tab title="我的">
        <MeMessageList />
      </van-tab>
      <van-tab title="队伍">
        <TeamMessageList />
      </van-tab>
      <van-tab title="任务">
        <TaskMessageList />
      </van-tab>
    </van-tabs>
  </view>
</template>

<script>
import MeMessageList from "./components/MeMessageList.vue";
import TeamMessageList from "./components/TeamMessageList.vue";
import TaskMessageList from "./components/TaskMessageList.vue";
export default {
  components: {
    MeMessageList,
    TeamMessageList,
    TaskMessageList,
  },
  data() {
    return {};
  },
  methods: {
    changeMessageTab(e) {
      console.log(e.detail);
    },
  },
};
</script>

<style lang="scss"></style>
<style>
page {
  background-color: #fff;
  height: 100%;
}
</style>
